<!-- 文件上传 -->
<template>
  <a-upload
    name="file"
    accept=".doc, .docx, .xls, .xlsx, .ppt, .pptx, .pdf"
    :action="uploadApi.apk"
    :file-list="fileList"
    :headers="headers"
    @change="handleChange"
  >
    <a-button type="primary" :disabled="disabled"> <a-icon type="upload" /> {{ btnText }} </a-button>
  </a-upload>
</template>

<script>
import { uploadApi } from '@/api/upload'
import Vue from 'vue'
import { ACCESS_TOKEN, TENANTID } from '@/store/mutation-types'

export default {
  props: {
    disabled: {
      required: false,
      type: Boolean,
      default: () => false
    },
    btnText: {
      required: false,
      type: String,
      default: () => '上传附件'
    },
    openMessage: {
      type: Boolean,
      default: () => true
    }
  },
  components: {},
  data() {
    return {
      uploadApi,
      headers: {
        token: Vue.ls.get(ACCESS_TOKEN),
        tenantId: Vue.ls.get(TENANTID)
      },
      loading: false,
      defaultFileList: [],
      fileList: []
    }
  },
  computed: {},
  watch: {},
  methods: {
    handleChange(info) {

      this.$emit('change', info)
      if (info.file.status !== 'uploading') {
        // console.log(info.file, info.fileList);
      }
      this.fileList = info.fileList.filter(f => f.status !== 'done')

      if (info.file.status === 'done') {
        var res = info.file.response
        if (res) {
          this.openMessage && this.$message.success(`${info.file.name} 上传成功`)
          this.$emit('uploadSuccess', res.data.fileUrl, { ...res.data, name: info.file.name, uid: info.file.uid })
        }
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败`)
      }
    }
  },
  created() {},
  mounted() {}
}
</script>
<style scoped></style>
